<template>
  <view>
    <div class="chessboard">
      <div
        class="grid"
        v-for="(row, rowIndex) in chessBoard"
        :key="rowIndex"
      >
        <div
          class="cell"
          v-for="(cell, colIndex) in row"
          :key="colIndex"
          :class="{ 'black-piece': cell === 1, 'white-piece': cell === 2 }"
          @tap="handleChessClick(rowIndex, colIndex)"
        ></div>
      </div>
    </div>
  </view>
</template>

<script>
export default {
  data() {
    return {
      chessBoard: [], // 棋盘数据
      me: true, // 玩家执黑棋
      over: false, // 游戏结束标志
      wins: [], // 赢法数组
      myWin: [], // 玩家赢法统计数组
      computerWin: [], // 电脑赢法统计数组
      count: 0, // 赢法总数
    };
  },
  onReady() {
    this.initGame();
  },
  methods: {
    initGame() {
      // 初始化游戏
      this.count = 0;
      this.chessBoard = new Array(15).fill(0).map(() => new Array(15).fill(0));
      this.wins = new Array(15).fill(0).map(() => new Array(15).fill(0).map(() => new Array(572).fill(false)));
      this.myWin = new Array(572).fill(0);
      this.computerWin = new Array(572).fill(0);
      this.drawChessBoard();
    },
    drawChessBoard() {
      // 绘制棋盘网格
      for (let i = 0; i < 15; i++) {
        for (let j = 0; j < 15; j++) {
          this.chessBoard[i][j] = 0;
        }
      }
    },
    handleChessClick(row, col) {
      // 处理玩家点击棋盘的逻辑
      if (this.over) {
        return;
      }
      if (!this.me) {
        return;
      }
      if (this.chessBoard[row][col] === 0) {
        this.$set(this.chessBoard[row], col, 1); // 使用 $set 更新数组元素
        for (let k = 0; k < this.count; k++) {
          if (this.wins[row][col][k]) {
            this.myWin[k]++;
            this.computerWin[k] = 6;
            if (this.myWin[k] === 5) {
              uni.showModal({
                title: '游戏结束',
                content: '恭喜你，你赢了！',
                showCancel: false,
              });
              this.over = true;
              return;
            }
          }
        }
        if (!this.over) {
          this.me = !this.me;
          this.computerAI();
        }
      }
    },
    computerAI() {
      // 电脑下棋逻辑
      const chessBoard = this.chessBoard;
      const myWin = this.myWin;
      const computerWin = this.computerWin;
      const count = this.count;

      let u = 0;
      let v = 0;
      let max = 0;

      // 计算棋盘上每个位置的分数
      const myScore = Array.from({ length: 15 }, () => Array(15).fill(0));
      const computerScore = Array.from({ length: 15 }, () => Array(15).fill(0));

      for (let i = 0; i < 15; i++) {
        for (let j = 0; j < 15; j++) {
          if (chessBoard[i][j] === 0) {
            for (let k = 0; k < count; k++) {
              if (this.wins[i][j][k]) {
                if (myWin[k] === 1) {
                  myScore[i][j] += 200;
                } else if (myWin[k] === 2) {
                  myScore[i][j] += 400;
                } else if (myWin[k] === 3) {
                  myScore[i][j] += 2000;
                } else if (myWin[k] === 4) {
                  myScore[i][j] += 10000;
                }

                if (computerWin[k] === 1) {
                  computerScore[i][j] += 220;
                } else if (computerWin[k] === 2) {
                  computerScore[i][j] += 420;
                } else if (computerWin[k] === 3) {
                  computerScore[i][j] += 2100;
                } else if (computerWin[k] === 4) {
                  computerScore[i][j] += 20000;
                }
              }
            }

            if (myScore[i][j] > max) {
              max = myScore[i][j];
              u = i;
              v = j;
            } else if (myScore[i][j] === max) {
              if (computerScore[i][j] > computerScore[u][v]) {
                u = i;
                v = j;
              }
            }

            if (computerScore[i][j] > max) {
              max = computerScore[i][j];
              u = i;
              v = j;
            } else if (computerScore[i][j] === max) {
              if (myScore[i][j] > myScore[u][v]) {
                u = i;
                v = j;
              }
            }
          }
        }
      }

      this.$set(chessBoard[u], v, 2); // 电脑落子
      for (let k = 0; k < count; k++) {
        if (this.wins[u][v][k]) {
          computerWin[k]++;
          myWin[k] = 6;
          if (computerWin[k] === 5) {
            uni.showModal({
              title: '游戏结束',
              content: '电脑赢了！',
              showCancel: false,
            });
            this.over = true;
          }
        }
      }
      if (!this.over) {
        this.me = !this.me;
      }
    },
  },
};
</script>

<style scoped>
/* 棋盘样式 */
.chessboard {
  display: grid;
  grid-template-columns: repeat(15, 30px);
  grid-template-rows: repeat(15, 30px);
  width: 450px;
  height: 450px;
  background-color: #e0d7b0; /* 棋盘背景色 */
}

/* 棋子样式 */
.cell {
  width: 26px;
  height: 26px;
  border-radius: 50%;
}

.black-piece {
  background-color: #0A0A0A; /* 黑子颜色 */
}

.white-piece {
  background-color: #D1D1D1; /* 白子颜色 */
}
</style>
